// 帮卖邀请好友赚钱专用分享弹窗
<template>
  <view class="fixed_box" @click.stop="$emit('closeInviteFn')">
    <view class="inviteFriends_box" @click.stop="">
      <view class="invite_msg_box">
        <view class="user_box">
          <img class="groupAvatar_box" :src="helpSellData.groupAvatar" alt="">
          <view class="groupNickname_box fz-14 viceColorN8">{{helpSellData.groupNickname}}</view>
        </view>
        <view class="text_box fz-14 fw6 tc u-m-t-32">邀请好友成为TA的帮卖，</view>
        <view class="text_box fz-14 fw6 tc">你将获得推荐奖金：</view>
        <view class="text_box fz-14 fw6 tc items-center justify-center u-m-t-24">好友销售额<i class="u-p-l-8 u-p-r-8">x</i><i class="fz-16 fw6">{{helpSellData.recommendBonusRatio}}%</i></view>
      </view>
      <button class="invite_btn" @click.stop="$emit('inviteShareFn')"></button>
    </view>
  </view>
</template>

<script>

export default {
  props: {
    helpSellData: {
      type: Object,
      required: true,
      default: () => {}
    }
  },
  methods: {
  },
}
</script>
<style lang="scss" scoped>
.inviteFriends_box {
  width: 622rpx;
  height: 860rpx;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  background-image: url('https://qqposs.oss-cn-shenzhen.aliyuncs.com/mpAppImg/prizePool/invite_01.png');
  background-size: cover;
  .invite_msg_box {
    width: 414rpx;
    position: absolute;
    top: 356rpx;
    left: 50%;
    transform: translate(-50%);
    .user_box {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 1;
      .groupAvatar_box {
        flex: 0 0 auto;
        width: 56rpx;
        height: 56rpx;
        border-radius: 50%;
        margin-right: 16rpx;
      }
      .groupNickname_box {
        @include toe();
      }
    }
    .text_box {
      color: #ED6A0C;
      line-height: 40rpx;
    }
  }
  .invite_btn {
    width: 504rpx;
    height: 120rpx;
    position: absolute;
    bottom: 28rpx;
    left: 50%;
    transform: translate(-50%);
    background: url('https://qqposs.oss-cn-shenzhen.aliyuncs.com/mpAppImg/prizePool/invite_03.png');
    background-size: cover;
  }
}
</style>